<template>
	<view class="vote" v-if="show">
		<view class="vote_title">
			问卷调查
		</view>
		<view class="vote_content">
			<view class="">
				此批量查询身份证已经免费5年，是针对旅游行业批量查询归属地而开发。由于服务器费用由作者自己支出现已无力承担。您是否还想继续使用，是否愿意分担服务器费用吗？
			</view>
			<view style="margin-top: 20rpx;">
				初始定价3杯奶茶钱（60元），报名请添加作者微信先凑人数暂时不用付钱，如果能凑齐服务器费用明年继续使用，当然白嫖用户也不在使用提供使用了。
			</view>
		</view>
		<view class="vote_btn">
			<div class="vote_button" style="background: red;color: #fff;" @click="submit(2)">我愿意</div>
			<div class="vote_button" @click="submit(0)">不愿意</div>
		</view>
	</view>
</template>

<script setup>
	import {ref} from "vue"
	import {userStore} from "@/store/index.js"
	let show = ref(false)
	let user = userStore();
	
	uni.getStorage({
		key: "VoteInfo",
		success: res => {
			show.value = res.data == '1' ? false:true;
		},
		fail() {
			show.value = true
		}
	})
	
	const submit = (value) => {
		uni.request({
			url: 'http://ai.qinhai269.com/miniapp/79P8n74fxaxO', //仅为示例，并非真实接口地址。
			data: {
				value,
				device_id: user.deviceId
			},
			method: "POST",
			success: (res) => {
				uni.setStorage({
					key: "VoteInfo",
					data: '1',
					success() {
						setTimeout(_ => {
							show.value = false;
						}, 2000)
					}
				})
				
				uni.showToast({
					title: res.data.msg,
					icon: "none"
				})
				
			}
		});
	}
</script>

<style lang="scss" scoped>
	.vote {
		margin: 20rpx;
		background: #fff;
		padding: 30rpx;
		border-radius: 20rpx;

		&_title {
			font-weight: bold;
			color: #f30;
			font-size: 32rpx;
		}

		&_content {
			font-size: 28rpx;
			margin-top: 10rpx;
			text-indent: 3ch;
		}

		&_btn {
			display: flex;
			justify-content: right;
			margin-top: 20rpx;
		}

		&_button {
			padding: 10rpx 40rpx;
			background: #eee;
			margin: 10rpx;
			border-radius: 50rpx;
		}
	}
</style>